<template>
  <div class="details">
   
    <div class="return" @click="back">
      <span>Go back</span>
      <img src="@/assets/images/return_you.png" alt />
    </div>
     <h1>{{title}}</h1>
    <video :src="video" style="width= 100%; height=100%; object-fit:cover" controls></video>
    <div class="content" v-html="content"></div>
  </div>
</template>
<script>
import { video_visit } from "@/api/about.js";
export default {
  data() {
    return {
      content: "",
      title: "",
      video:'', 
    };
  },
  mounted() {
    let id = this.$route.query.id;
    video_visit({ id: id }).then(res => {
       if (this.$isMobile()) {
        this.content = this.$pxToRem(res.data.data.content);
      } else {
        this.content = res.data.data.content;
      }
      this.title = res.data.data.title;
      this.video=this.$store.state.headTitle.urlLink + res.data.data.video;
    });
  },
  methods: {
    back() {
      this.$router.go(-1); //返回上一层
    }
  }
};
</script>
<style scoped src="./sass/aboutUs.css"></style>